<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" xml:lang="en-US">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=us-ascii" />
        <title>jQuery MegaMenu Plugin</title>
        <link rel="stylesheet" href="stylesheets/jquery.megamenu.css" type="text/css" media="screen" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
        </script>
        <script src="javascripts/jquery.megamenu.js" type="text/javascript">
        </script>
        <script type="text/javascript">
            $(document).ready(function(){
                var SelfLocation = window.location.href.split('?');
                switch (SelfLocation[1]) {
                    case "defined_width":
                        $(".MegaMenuLink").megamenu(".MegaMenuContent", {
                            width: "850px"
                        });
                        break;
                    case "auto_width_right":
                        $(".MegaMenuLink").megamenu(".MegaMenuContent", {
                            justify: "right"
                        });
                        $('.MegaMenu').css("text-align", "right");
                        break;
                    case "defined_width_right":
                        $(".MegaMenuLink").megamenu(".MegaMenuContent", {
                            justify: "right",
                            width: "850px"
                        });
                        $('.MegaMenu').css("text-align", "right");
                        break;
                    default:
                        $(".MegaMenuLink").megamenu(".MegaMenuContent");
                        break;
                }
            });
        </script>
    </head>
    <body>
        <table id="Container">
            <tr>
                <td valign="top">
                    <div id="Header">
                    </div>
                    <div class="MegaMenu">
                        <a class="MegaMenuLinkOff" href="#">Normal Menu</a>
                        <a class="MegaMenuLink" href="javascript:void(0)">First Mega Menu</a>
                        <div class="MegaMenuContent">
                            <table class="MegaMenuTable" border="0">
                                <tr>
                                    <th>
                                        <div class="MegaMenuHead">
                                            First Heading
                                        </div>
                                    </th>
                                    <th>
                                        <div class="MegaMenuHead">
                                            Second Heading
                                        </div>
                                    </th>
                                    <th>
                                        <div class="MegaMenuHead">
                                            Third Heading
                                        </div>
                                    </th>
                                </tr>
                                <tr>
                                    <td>
                                        <ul class="MegaMenuLists">
                                            <li>
                                                <a href="#">First Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Second Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Third Link</a>
                                            </li>
                                        </ul>
                                    </td>
                                    <td>
                                        <ul class="MegaMenuLists">
                                            <li>
                                                <a href="#">Fourth Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Fifth Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Sixth Link</a>
                                            </li>
                                        </ul>
                                    </td>
                                    <td class="LastCell">
                                        <ul class="MegaMenuLists">
                                            <li>
                                                <a href="#">Seventh Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Seventh Link</a>
                                            </li>
                                        </ul>
                                    </td>
                                </tr>
                            </table>
                        </div>
                        <a class="MegaMenuLink" href="javascript:void(0)">Second Mega Menu</a>
                        <div class="MegaMenuContent">
                            <table class="MegaMenuTable" border="0">
                                <tr>
                                    <th>
                                        <div class="MegaMenuHead">
                                            First Heading
                                        </div>
                                    </th>
                                    <th>
                                        <div class="MegaMenuHead">
                                            Second Heading
                                        </div>
                                    </th>
                                </tr>
                                <tr>
                                    <td>
                                        <ul class="MegaMenuLists">
                                            <li>
                                                <a href="#">First Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Second Link</a>
                                            </li>
                                            <li>
                                                <a href="#">Third Link</a>
                                            </li>
                                        </ul>
                                    </td>
                                    <td class="LastCell">
                                        <ul class="MegaMenuLists">
                                            <li>
                                                <a href="#">Fourth Link</a>
                                            </li>
                                        </ul>
                                    </td>
                                </tr>
                                <tr>
                                    <td colspan="2" class="LastCell">
                                        <div style="padding: 10px 10px 0px 10px;">
                                            More text can go here.
                                        </div>
                                    </td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div>
                        <ul>
                            <li>
                                <a href="index.html">Auto Width Example</a>
                            </li>
                            <li>
                                <a href="?defined_width">Defined Width Example (850px MegaMenu)</a>
                            </li>
                            <li>
                                <a href="?auto_width_right">Auto Width Right Justified Example</a>
                            </li>
                            <li>
                                <a href="?defined_width_right">Defined Width Right Justified Example (850px MegaMenu)</a>
                            </li>
                        </ul>
                    </div>
                </td>
            </tr>
        </table>
        <script type="text/javascript">
            /* <![CDATA[ */
            var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
            document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
            /* ]]> */
        </script>
        <script type="text/javascript">
            /* <![CDATA[ */
            try {
                var pageTracker = _gat._getTracker("UA-10628239-1");
                pageTracker._trackPageview();
            } 
            catch (err) {
            }
            /* ]]> */
        </script>
    </body>
</html>
